<script setup>
import FullScreen from '../components/FullScreen.vue';
import Temp from '../components/Temp.vue';

const props =  defineProps({
    msg: {
        type: String,
        required: true
    },
    data: {
        type: Object,
        required: false,
        default (){
            return { 
                id:1,
                title:'新闻标题新闻标题新闻标题新闻标题新闻标题新闻标题',
                author:'小编名字',
                createtime: '2024年3月30日',
                content: '<p>正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容</p><img src="/src/assets/image_1.png" ><p>正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内容正文内</p>'
            }
        }
    }
})


</script>

<template>
    <Temp lit=[]>
        <div class="container mx-auto w-full mobile:p-2">
            <div class="w-full pt-[100px]">
                <span class="fa fa-angle-left"> 返回</span>
            </div>
            <div class="w-full h-auto self-center bg-no-repeat">
                <div class="flex my-[50px]">
                    <h1 class="text-3xl">新闻标题新闻标题新闻标题新闻标题新闻标题新闻标题</h1>
                </div>
                <div class="w-full self-center mx-auto">
                    <p class="text-gray2"><span>发布时间：</span><span>{{ data.createtime }}</span>&nbsp;&nbsp;&nbsp;&nbsp;<span>编辑：</span><span>{{ data.author }}</span></p>
                </div>
                <div class="w-full self-center mx-auto my-[50px] atext text-gray-400" v-html="data.content">
                </div>
            </div>
        </div>
    </Temp>
</template>
<style scoped>
ul.grid li.active{
  border-color: #2F3767;
  color: #2F3767
}
.mask::before{
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-color: #2F3767cc;
    pointer-events: none;
}
.atext{
    position: relative;
}
.atext img{
    max-width: 100%;
    margin: 20px auto;
}
.atext p{
    margin: 20px 0 ;
}
</style>